<template>
  <Component @reload="reload" :selections="selections"
             :formDefinition="formDefinition" :is="component" :button="button"/>
</template>
<script setup>
import {defineAsyncComponent, shallowRef, watchEffect} from 'vue';
import {isEmpty} from '@/utils/CommonUtils';
import {DefaultFormDefinition} from '@/components/form/DefaultFormDefinition';

defineOptions({
  name: 'FormListButtonDelegate'
});
const emits = defineEmits(['reload']);

const component = shallowRef();
const props = defineProps({
  button: undefined,
  formDefinition: JSON.parse(JSON.stringify(DefaultFormDefinition)),
  selections: {
    type: Array,
    default: () => [],
  },
});

watchEffect(() => {
  setButtonComponent();
});

function reload() {
  emits('reload');
}

function setButtonComponent() {
  let button = props.button;
  if (isEmpty(button)) {
    component.value = undefined;
  } else {
    component.value = defineAsyncComponent(() => import('@/components/' + props.button.buttonComponent));
  }
}


</script>
